import './style.css';
import * as React from 'react';
import ReactDOM from 'react-dom';

class Hello extends React.Component {
    render () {
        return React.createElement('div', {'className': 'text-red'}, `Hello ${this.props.toWhat}`);
    }
}

const div = document.createElement('div');
document.body.appendChild(div);

let i = 0;
console.log('time start');
let interval = setInterval(function () {
    i++;
    console.log(`Has been past ${i} second`);
    if (i === 3) {
        import(/* webpackMode: "lazy" */'lodash').then(function (_) {
            console.log('第一次异步加载 lodash 成功');
            console.log(`lodash 版本 ${_.VERSION}`);
        }).catch(err => {
            console.log('Err:');
            console.error(err);
        });
    }
    if (i === 6) {
        clearInterval(interval);
        import(/* webpackMode: "lazy" */'lodash').then(function (_) {
            console.log('第二次异步加载 lodash 成功');
            console.log(`lodash 版本 ${_.VERSION}`);
        }).catch(err => {
            console.log('Err:');
            console.error(err);
        });
    }
}, 1000);

ReactDOM.render(
    React.createElement(Hello, {toWhat: 'World'}, null),
    div
);